<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
    <title>Title</title>
    <link rel="stylesheet" href="css/style.css">
    <script src="js/jquery1.8.3.min.js"></script>
</head>
<body>
    <div class="top">
       <img src="img/1.jpg">
    </div>
    <div class="timebox">
        <div class="time">
            17:10:34
        </div>
        <div class="timebg breathe-btn">
            <div class="timebgitem" style="background: rgb(170,62,122)">

            </div>
            <div class="timebgitem" style="background: rgb(145,107,172)">

            </div>
            <div class="timebgitem" style="background: rgb(82,151,153)">

            </div>
        </div>

    </div>
 <div class="m2">
     <img src="img/2.jpg">
 </div>
<script>
    function getLocalTime(i) {
        //参数i为时区值数字，比如北京为东八区则输进8,纽约为西5区输入-5
        if (typeof i !== 'number') return;
        var d = new Date();
        //得到1970年一月一日到现在的秒数
        var len = d.getTime();
        //本地时间与GMT时间的时间偏移差
        var offset = d.getTimezoneOffset() * 60000;
        //得到现在的格林尼治时间
        var utcTime = len + offset;
        // console.log(utcTime)
 var dete=new Date(utcTime + 3600000 * i);
        // console.log(dete)
        // console.log(dete.toLocaleDateString().replace(/\//g, "-") + " " + dete.toTimeString().substr(0, 8));
        // console.log(dete.toTimeString().substr(0, 8));
        $('.time').html(dete.toTimeString().substr(0, 8))
        //return new Date(utcTime + 3600000 * i);
    }
    getLocalTime(1)
    setInterval(function () {
        getLocalTime(1)
    },1000)

</script>
</body>
</html>